<!-- 项目审批 -->
<template>
	<view>
		<cu-custom bgColor="bg-blue2" :isBack="true" @back="backedPage"><block slot="backText">返回</block><block slot="content">移库明细编辑</block></cu-custom>
	
	<view>

			<form @submit="onSubmit">
				<view class="cu-form-group">
					<view class="title xrequired">名称</view>
					<input :class="!item.inStockGoodsDetail.goodsName ? 'xrwaning' : ''" v-model="item.inStockGoodsDetail.goodsName" name="input" @focus="selectGoods()"disabled="disabled"></input>
					<button class="cu-btn block bg-blue margin-tb-sm lg" type="" @tap="selectGoods">选择货物</button>
				</view>
				<view class="cu-form-group">
					<view class="title">规格</view>
					<input v-model="item.inStockGoodsDetail.spec" name="input"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">产地</view>
					<input v-model="item.inStockGoodsDetail.maker" name="input"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">型号</view>
					<input v-model="item.inStockGoodsDetail.model" name="input"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">材质</view>
					<input v-model="item.inStockGoodsDetail.materialCode" name="input"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">原货位</view>
					<input v-model="item.goodsPosiOrg" name="input" disabled="disabled"></input>
				</view>
				<view class="cu-form-group">
					<view class="title xrequired">新货位</view>
					<input :class="!item.goodsPosiNew ? 'xrwaning' : ''" v-model="item.goodsPosiNew" name="input" @blur="checkPosi"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">原数量</view>
					<input v-model="item.qtyOriginal" name="input" disabled="disabled">{{item.inStockGoodsDetail.qtyUnit}}</input>
				</view>
				<view class="cu-form-group">
					<view class="title">原重量</view>
					<input v-model="item.weightOriginal" name="input" disabled="disabled">{{item.inStockGoodsDetail.weightUnit}}</input>
				</view>
				<view class="cu-form-group">
					<view class="title">可移数量</view>
					<input v-model="item.qtyAvailable" name="input" disabled="disabled">{{item.inStockGoodsDetail.qtyUnit}}</input>
				</view>
				<view class="cu-form-group">
					<view class="title">可移重量</view>
					<input v-model="item.weightAvailable" name="input" disabled="disabled">{{item.inStockGoodsDetail.weightUnit}}</input>
				</view>
				<view class="cu-form-group">
					<view class="title">移库数量</view>
					<input v-model="item.qtyActual" name="input" disabled="disabled">{{item.inStockGoodsDetail.qtyUnit}}</input>
				</view>
				<view class="cu-form-group">
					<view class="title">移库重量</view>
					<input v-model="item.weightActual" name="input" disabled="disabled">{{item.inStockGoodsDetail.weightUnit}}</input>
				</view>
				<view class="cu-form-group">
					<!-- <view class="title">作业班组</view> -->
					<uni-combox :class=" !item.workGroup ? 'xrequiredCombox xrwaningCombox' : 'xrequiredCombox'" label="作业班组" :candidates="workGroupOptions" placeholder="请选择作业班组" v-model="item.workGroup"></uni-combox>
				</view>
				<view>
					<button form-type="submit" class="cu-btn block bg-blue margin-tb-sm lg" :disabled="loading" type="">
						<text :class="loading ? 'cuIcon-loading2 cuIconfont-spin' : ''"></text>保存</button>
				</view>
			</form>
			<view class="cu-modal" :class="isShowGoodsDialog ? 'show' : ''">
				<view class="cu-dialog" :style="{ marginTop: customBarH+'px' }">
					<view class="cu-bar bg-white justify-end">
						<view class="content">选择货物</view>
						<view class="action" @tap="hideModal">
							<text class="cuIcon-close text-red"></text>
						</view>
					</view>
					<view :style="{height: winHeight+'px'}">
						<select-goods
							ref="goodsRef"
							:tableHeight="580"
							:windowWidth="windowWidth"
							:padding="padding"
							:clientId="clientId"
							@selected="selectedClick" />
					</view>
				</view>
			</view>
	</view>
	
	</view>
	
</template>

<script>
	import uniTag from '@/components/uni-tag/uni-tag.vue'
	import uniIcons from '@/components/uni-icons/uni-icons.vue'
	import uniCombox from '@/components/uni-combox/uni-combox.vue'
	import refresh from "@/components/refresh/refresh.vue"
    import selectGoods from './selectGoods.vue'
	import {
		mapGetters
	} from 'vuex'
	import {
		getRandomArrayElements,
		filePreview,
		formatStatus
	} from '@/utils/index.js'
	import { formatDate } from '@/utils/datetime.js'
	export default {
		components: {
			uniTag,
			uniIcons,
			uniCombox,
			refresh,
			selectGoods
		},
		computed: mapGetters(['user']),
		data() {
			return {
				item: { inStockGoodsDetail: {goodsName:''} },
				detailId: 0,
				goodsPosiChngBillId:0,
				weightMethodOptions:['抄码','过地磅','过电子磅','理算','平均件重'],
				workGroupOptions:[],
				machineOptions:[],
				goodsPosiChngTypeOptions:['','吊装','人工自装'],
				ordTypeOptions: ['客户提单','物资调拨单','电子订单'],
				data: [],
				defaultProps: {
					children: 'children',
					label: 'fullName'
				},
				isShowGoodsDialog: false,
				isShowGoodsPosiDialog: false,
				selectedPosiObj: {},
				loading: false,
				// 列表数据
				cardList: [],
				searchVal: '',
				pageIndex: 1,
				pageSize: 10,
				customBarH:this.CustomBar+20,
				winHeight:0,
				windowWidth:0,
				padding:0,
				clientId:0
			}
		},
		onLoad(options) {
			
			//  高度自适应
			uni.getSystemInfo({
				success: res => {
					this.winHeight = (res.windowHeight-this.customBarH)*0.75
					this.windowWidth = res.windowWidth * 0.15
					this.padding = res.windowWidth / 750 * 20
				}
			})

			this.detailId = options.detailId
			this.goodsPosiChngBillId = options.goodsPosiChngBillId
			if (this.detailId >0 && this.detailId > 0) {
				this.$minApi.goodsPosiChngBill(this.goodsPosiChngBillId).then(res => {
					const data = res
					if (data) {
						const detailId = Number(this.detailId)
						const detail =  data.goodsPosiChngDetails.find(f => f.id === detailId)

						if (detail) {
							this.item = detail
						}
					}
				}).catch(err => {
					console.log(err)
				}).finally(() => {
				})
			} else {
				uni.setNavigationBarTitle({
				title: '新增移库明细'
				})
				
				this.$minApi.goodsPosiChngBill(this.goodsPosiChngBillId).then(res => {
					const data = res
					if (data) {
						this.clientId=res.clientID
					}
				}).catch(err => {
					console.log(err)
				}).finally(() => {
				})
			}
						
			this.$minApi.getWorkGroups().then(res => {
				const data = res
				if (data) {
					this.workGroupOptions =	data.map(a => a.name)
				}
			}).catch(err => {
				console.log(err)
			}).finally(() => {
				this.isLoading = false
			})
			
			this.$minApi.getMachines().then(res => {
				const data = res
				if (data) {
					this.machineOptions = data.map(a => a.name)
				}
			}).catch(err => {
				console.log(err)
			}).finally(() => {
				this.isLoading = false
			})

		},
		methods: {
			filePreview,
			formatStatus,
			formatDate,
			onSubmit(e) {  
				
				if(!this.item.inStockGoodsDetail.goodsName 
					|| !this.item.goodsPosiNew
					|| !this.item.workGroup) {
					uni.showToast({
						icon: 'none',
					    title: '必填项未填写',
					    duration: 2000
					})
					return
				}
				
				this.loading = true
				const _this = this
				
				this.item.qtyOriginal = Number(this.item.qtyOriginal)
				this.item.weightOriginal = Number(this.item.weightOriginal)
				this.item.qtyAvailable = Number(this.item.qtyAvailable)
				this.item.weightAvailable = Number(this.item.weightAvailable)
				this.item.qtyActual = Number(this.item.qtyActual)
				this.item.weightActual = Number(this.item.weightActual)
				this.item.goodsPosiChngBillId =  Number(this.goodsPosiChngBillId)
				
				if (this.detailId > 0) {					
					
					_this.$minApi.updateGoodsPosiChngDetail(this.item.id, this.item).then(res => {
						uni.showToast({
						    title: '修改成功',
						    duration: 2000
						})
						
						setTimeout(() => {
							uni.redirectTo({
								url: `/pages/todo/goodsPosiChngBill/detail?id=${this.goodsPosiChngBillId}`
							})
						}, 2000)
				
					}).catch(err => {
						uni.showToast({
							icon: 'none',
						    title: '修改失败',
						    duration: 2000
						})
					}).finally(() => {
						this.loading = false
					})
				} else {
										
					// this.item.goodsPosiChngDetailID = Number(this.item.goodsPosiChngDetailID)
					_this.$minApi.createGoodsPosiChngDetail(this.item).then(res => {
						uni.showToast({
						    title: '添加成功',
						    duration: 2000
						})
						
						setTimeout(() => {
							uni.redirectTo({
								url: `/pages/todo/goodsPosiChngBill/detail?id=${this.goodsPosiChngBillId}`
							})
						}, 2000)
					}).catch(err => {
						uni.showToast({
							icon: 'none',
						    title: '添加失败',
						    duration: 2000
						})
						console.log(err)
					}).finally(() => {
						this.loading = false
					})
				}
				
			},
			hideModal(e) {
				this.isShowGoodsDialog = false
			},
			selectGoods() {	
				this.isShowGoodsDialog = true
			},
			selectedGoods(val) {
				this.isShowGoodsDialog = false
				if (val) {
					
					if (val) {
						
						this.item.inStockGoodsID = val.goodsID
						this.item.goodsPosi = val.goodsPosi
						this.item.batchNum = val.batchNum						
						this.item.actualQty = 0
						this.item.actualWeight = 0
						this.item.qty = 0
						this.item.weight = 0
						this.item.isInputTaskQuantity='否'
						this.item.isPayGoodsInFee='否'
						this.item.isPayStockFee='否'
						this.item.oldName=''
						
						this.item.inStockGoodsDetail.goodsName = val.goodsName						
						this.item.inStockGoodsDetail.qtyUnit = val.qtyUnit
						this.item.inStockGoodsDetail.weightUnit = val.weightUnit						
						this.item.inStockGoodsDetail.spec = val.spec
						this.item.inStockGoodsDetail.model = val.model
						this.item.inStockGoodsDetail.materialCode = val.materialCode
						this.item.inStockGoodsDetail.maker = val.maker
						this.item.inStockGoodsDetail.frzQty = val.frzQty
						this.item.inStockGoodsDetail.frzWeight = val.frzWeight						
						
					}
				}
				
			},
			selectedClick(val) {
			
				this.isShowGoodsDialog = false
					
				if (val) {
					
					this.item.inStockGoodsDetailID = val.id
					this.item.goodsPosiOrg = val.goodsPosi
					
					this.item.goodsPosiNew = val.goodsPosi
					
					this.item.batchNum = val.batchNum
					this.item.qtyOriginal= val.qty
					this.item.weightOriginal= val.weight
					this.item.qtyAvailable = val.qty-val.frzQty
					this.item.weightAvailable = val.weight-val.frzWeight
					this.item.qtyActual = 0
					this.item.weightActual = 0
					this.item.qty = 0
					this.item.weight = 0
					this.item.isInputTaskQuantity='否'
					this.item.isPayGoodsInFee='否'
					this.item.isPayStockFee='否'
					this.item.oldName=''
					
					this.item.inStockGoodsDetail.goodsName = val.goodsName						
					this.item.inStockGoodsDetail.qtyUnit = val.qtyUnit
					this.item.inStockGoodsDetail.weightUnit = val.weightUnit						
					this.item.inStockGoodsDetail.spec = val.spec
					this.item.inStockGoodsDetail.model = val.model
					this.item.inStockGoodsDetail.materialCode = val.materialCode
					this.item.inStockGoodsDetail.maker = val.maker
					this.item.inStockGoodsDetail.frzQty = val.frzQty
					this.item.inStockGoodsDetail.frzWeight = val.frzWeight						
					
				}

			},
			search() {
			
				// this.upOption.num = 1
				// uni.showLoading({
				// 	title: '正在查询数据...'
				// })
				/**
				 * todo: api请求查询项目待办
				 */
				let pageNum = this.pageIndex // 页码, 默认从1开始
				let pageSize = this.pageSize // 页长, 默认每页10条
				let goodsName = this.searchVal
				if (this.goodsName) {
					// goodsName = this.goodsName
				}
				const params = {
					// clientID: 181,//this.user.clientId,
					batchNum: this.searchVal,
					goodsName:  goodsName,
					goodsPosi: this.searchVal,
					pageIndex: pageNum,
					pageSize: pageSize
				  }
				this.$minApi.getInStockGoodsDetail(params).then(res => {
				
					const data = res
					if (data) {
						
						let totalPage = data.totalCount
						let hasNext = this.cardList.length < totalPage
						
						this.cardList = [] //如果是第一页需手动置空列表
						this.cardList = this.cardList.concat(data.list) //追加新数据
					
					}
				}).catch(err => {
					console.log(err)
				}).finally(() => {
					// // 隐藏加载状态
					// uni.hideLoading()
				})
			},
			clear() {
				this.searchVal = ''
				this.search()
			},
			onRefresh() {
			
				let pageNum = this.pageIndex // 页码, 默认从1开始
				let pageSize = this.pageSize // 页长, 默认每页10条
				let goodsName = this.searchVal
				if (this.goodsName) {
					// goodsName = this.goodsName
				}
				const params = {
					clientID: 181,//this.user.clientId,
					batchNum: this.searchVal,
					goodsName:  goodsName,
					goodsPosi: this.searchVal,
					pageIndex: pageNum,
					pageSize: pageSize
				  }
				this.$minApi.getInStockGoodsDetail(params).then(res => {
				
					const data = res
					if (data) {
						
						let totalPage = data.totalCount
						let hasNext = this.cardList.length < totalPage
						
						if (this.pageIndex === 1) this.cardList = [] //如果是第一页需手动置空列表
						this.cardList = this.cardList.concat(data.list) //追加新数据
					
						this.pageIndex =  this.pageIndex + 1	// 页码, 默认从1开始			
						
					}
				}).catch(err => {
					console.log(err)
				}).finally(() => {
					this.$refs.refresh.endAfter() //通知下拉刷新组件刷新已经完成
				})
				
			},
			hidePosiModal(e) {
				if (this.selectedPosiObj && this.selectedPosiObj.data) {
					this.item.goodsPosiNew = this.selectedPosiObj.data.fullName
				}
				this.isShowGoodsPosiDialog = false
			},
			checkPosi() {
				
				this.$minApi.getWareHouseFullName({ fullName: this.item.goodsPosiNew }).then((res) => {
					if(res){
						
					}else{
						uni.showToast({
							icon: 'none',
						    title: '货位不存在',
						    duration: 2000
						})
						this.item.goodsPosiNew = ''
					}
				}).catch(err => {
					console.log(err)
				}).finally(() => { })
				
			},
			selectPosi() {
				this.isShowGoodsPosiDialog = true
			},
			selectedPosi(val) {
				this.selectedPosiObj = val
			},
			backedPage() {
				uni.redirectTo({
					url: `/pages/todo/goodsPosiChngBill/detail?id=${this.goodsPosiChngBillId}&currDetailId=${this.detailId}`
				})
			}
		}
	}
</script>

<style scoped>
	.xrequired::after  {
		content: '*';
		color: red;
	}
	.xrwaning{
		border: 1px solid #FF0000;
	}
	/deep/ .xrequiredCombox .uni-combox__label span::after  {
		content: '*';
		color: red;
	}
	/deep/ .xrequiredCombox .uni-combox__label text::after  {
		content: '*';
		color: red;
	}
	/deep/.xrwaningCombox input{
		border: 1px solid #FF0000;
	}
</style>
